@import "./palette.styl"
table {
  display: table;
}

div--webkit--scrollbar($color = #f7f7f7) {
  &::-webkit-scrollbar-thumb {
    background-color: $color;
  }
  &::-webkit-scrollbar-thumb {
    background-color: $color;
    background-clip: padding-box;
    border: 3px solid transparent;
    border-radius: 7px;
  }
  &::-webkit-scrollbar {
    width: 13px;
    height: 14px; // 纵向滚动条 必写
  }
  &::-webkit-scrollbar-thumb:hover {
    background-color: rgba(0, 0, 0, 0.2);
  }
}
//html, body {
//  height: 100vh;
//  width: 100vw;
//  overflow hidden;
//}

ul {
  li {
    list-style none;
  }
}

div.custom-container {
  div.content,
  div.page-nav,
  div.page-edit {
    max-width: 1360px !important;
  }
  &.icon-container .content {
    .icon-content__wrapper + p {
      text-align: center;
    }
  }
  div.page div.content {
    &>h2 {
      font-size: 1.65rem;
    }
  }
}
.hero h1 {
  &::before {
    display: none;
  }
}
div.content:not(.custom),
div.page-nav:not(.custom),
div.page-edit:not(.custom) {
  max-width: 820px !important;
}
/*首页*/
.home-container {
  position: relative;
  min-height: 100vh;
  overflow-x: hidden;
  header.navbar {
    position: relative;
    padding: 0.7rem 9rem;
    box-shadow: none;
    border-bottom: none;
    background-color: transparent;
    a {
      .logo {
        display none;
      }
    }
    .site-name {
      color #fff;
      display none;
    }
    .links {
      background-color: transparent;
      .nav-link {
        color: #fff;
        border: none;
        &:after{
          background: #fff;
        }
      }
    }
    .dropdown-wrapper {
      display: none;
    }
  }
  @media only screen and (max-width: 992px) {
    header.navbar {
      padding-left: 4rem;
    }
  }
  div.search-box {
    display none;
    &::before {
      border-color: #fff;
    }
    &::after {
      background-color: #fff;
    }
    input:focus {
      color: #fff;
      border-bottom-color: #fff;
    }
  }
  div.custom-layout {
    position: absolute;
    top: 0;
    right: 0;
    width: 100%;
    min-height: 100vh;
    box-sizing: border-box;
  }
}

table {
  display: table;
  width: 100%;
  tr {
    //border: none;
    //background: transparent;
    &:nth-child(2n) {
      background-color: transparent;
    }
  }
  td, th {
    //border: none;
  }
  &[class^='el-'] {
    border-top: inherit;
    margin: 0;
    tr {
      border: inherit
      &:nth-child(2n) {
        background-color: transparent;
      }
    }
    th, td {
      border: inherit;
    }
  }
}


/*头部菜单*/
header.navbar {
  height: 3.75rem;
  border: none;
  box-shadow: 0 2px 4px 0 rgba(227,227,227,0.50);
  .links {
    display: inline-block;
    right: 2rem;
  }
  img.logo {
    border: none;
  }
  .site-name {
    display none;
  }
  .nav-item {
    font-size: 1rem;
    margin-left: 1.6rem;
    .nav-link {
      border: none;
      display: inline-block;
      position: relative;
      &:after{
        content: '';
        position: absolute;
        background: $accentColor!important;
        width: 100%;
        bottom: -21px;
        left: 0;
        height: 3px;
        transform: scaleX(0);
        opacity: 0;
        border-radius 2px;
        transition all 0.2s;
      }
      &.router-link-active, &:hover {
        border: none;
        &:after{
          transform: scaleX(1);
          opacity: 1;
        }
      }
    }
  }
}

/*左侧菜单*/
aside.sidebar {
  .sidebar-heading {
    font-size: 1.34rem;
  }
  a.sidebar-link {
    padding: 0.72rem 0 0.72rem 4rem;
    transform all 0.3s;
    border: none;
    display inline-block;
    position relative
    background: transparent;
    transition background 0.2s;
    &.active {
      font-weight: 400;
    }
    &:after{
      content: '';
      position: absolute;
      height: 100%;
      top: 0;
      left: 0;
      width: 5px;
      transform: scaleY(0);
      opacity: 0;
      background $accentColor!important;
      transition all 0.2s;
    }
    &.active {
      background: rgba($accentColor, 12%)!important;
      &:after {
        opacity: 1;
        transform: scaleY(1);
      }
    }
    &:hover {
      background: rgba($accentColor, 12%)!important;
      &:after {
        opacity: 1;
      }
    }
  }
  .sidebar-sub-header {
    a.sidebar-link.active {
      &.active {
        background-color: transparent;
      }
    }
  }
}


.theme-container {
  padding-right 232px;
  & > .page {
    .content__default {
      & > p {
        line-height: 22px;
        font-size: 0.875rem;
        color: #000622;
        text-align: justify;
      }
      & > h1:first-child, & > h2:first-child {
        padding-top 5.3rem;
      }
      & > h2 {
        font-size: 2em;
        border-bottom: none!important;
      }
      & > h4 {
        line-height: 2;
        font-size: 1rem;
      }
      & > table {
        display: table;
        width: 100%;
        margin: 8px 0 16px;
        border-collapse: collapse;
        border-spacing: 0;
        empty-cells: show;
        font-size: 14px;
        color: #34495e;
        &:hover {
          box-shadow: 0 0 8px 0 rgba(232, 237, 250, 0.6), 0 2px 4px 0 rgba(232, 237, 250, 0.5);
        }
        thead {
          display: table-header-group;
          vertical-align: middle;
        }
        tr {
          display: table-row;
          vertical-align: inherit;
          td, th {
            padding: 10px 14px;
            text-align: left;
          }
          td:first-child,
          th:first-child {
            width: 20%;
          }
          td {
            //border-bottom: 1px solid #eaeefb;
            max-width: 250px;
            line-height: 1.5;
            border-color: #ebebeb;
          }
          th {
            white-space: nowrap;
            font-weight: 700;
            background: #f5f5f5;
          }
          &:hover {
            background: #f5f5f5;
          }
        }
      }

      & > blockquote {
        font-size: 14px;
      }
    }
  }
  @media only screen and (max-width: 1440px) {
    padding-right 0;
    & > .page {
      padding-left: 250px;
    }
  }
  &.no-sidebar {
    padding-right 0;
    @media only screen and (max-width: 1440px) {
      & > .page {
        padding-left: 0;
      }
    }
    & > .page {
      //height 'calc(100vh - %s)' % $navbarHeight;
      //box-sizing: border-box;
      //overflow-y: auto;
      //margin-top: $navbarHeight;
    }
  }
}
.custom-block{
  &.tip {
    border-color: $accentColor;
  }
}

.global-ui {
  .custom-anchor-plugin {
    top: 3rem!important;
    right: 12px!important;
    max-width: 220px;
    width 220px;
    .ra-button {
      display: none;
    }
    @media only screen and (max-width: 1440px) {
      display: none!important;
    }
  }
  .show-custom-anchor-plugin {
    top: 3rem!important;
    right: 12px!important;
    max-width: 220px;
    width 220px;
    .ra-button {
      display: none;
    }
  }
}

[class*=" m-icon-"],[class^=m-icon-]{
  font-family:m-icon!important;
  speak:none;
  font-style:normal;
  font-weight:400;
  font-variant:normal;
  text-transform:none;
  line-height:1;
  vertical-align:baseline;
  display:inline-block;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale
}
